<template>
  <div class="app-container">
   

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="Plus"
          @click="handleAdd"
          v-hasPermi="['line:line:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="Edit"
          :disabled="single4"
          @click="handleUpdate3"
          v-hasPermi="['line:line:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="Delete"
          :disabled="multiple4"
          @click="handleDelete3"
          v-hasPermi="['line:line:remove']"
        >删除</el-button>
      </el-col>
      
      <right-toolbar v-model:showSearch="showSearch3" @queryTable="getList3"></right-toolbar>
    </el-row>

    <el-table v-loading="loading3" :data="lineList" @selection-change="handleSelectionChange4">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="行ID" align="center" prop="lineId" />
      <el-table-column label="物料编码" align="center" prop="itemCode" />
      <el-table-column label="物料名称" align="center" prop="itemName" />
      <el-table-column label="规格型号" align="center" prop="specification" />
      <el-table-column label="单位" align="center" prop="unitOfMeasure" />
      <el-table-column label="退料数量" align="center" prop="quantityRt" />
      <el-table-column label="领料批次号" align="center" prop="batchCode" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button link type="primary" icon="Edit" @click="handleUpdate3(scope.row)" v-hasPermi="['line:line:edit']">修改</el-button>
          <el-button link type="primary" icon="Delete" @click="handleDelete3(scope.row)" v-hasPermi="['line:line:remove']">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    
    <pagination
      v-show="total4>0"
      :total="total4"
      v-model:page="queryParams3.pageNum"
      v-model:limit="queryParams3.pageSize"
      @pagination="getList3"
    />

    <!-- 添加或修改生产退料单行对话框 -->
     <el-dialog v-model="open3"  :title="title4" width="900px" @close="handleDialogClose3">
      <el-row :gutter="15">
        <el-form ref="formRef" :model="form1" :rules="rules3" size="default" label-width="120px">
          <el-col :span="24">
            <el-row gutter="15">
              <el-col :span="8">
                <el-form-item label="物料编码" prop="itemCode">
                  <el-input v-model="form1.itemCode" type="text" placeholder="请输入物料编码" clearable disabled
                    :style="{width: '100%'}"></el-input>
                  <el-icon @click="kaii1" style="border: 1px solid #DCDFE6;width: 30px;height: 30px;background-color: #F5F7FA;cursor: pointer;position: relative;left:155px;top:-31px"><Search /></el-icon>

                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="物料名称" prop="itemName">
                  <el-input v-model="form1.itemName" type="text" placeholder="请输入物料名称" clearable disabled
                    :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="单位" prop="unitOfMeasure">
                  <el-input v-model="form1.unitOfMeasure" type="text" placeholder="请输入单位" clearable disabled
                    :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-col>
          
          <el-col :span="20">
            <el-form-item label="规格型号" prop="specification">
              <el-input v-model="form1.specification" type="text" placeholder="请输入规格型号" clearable disabled
                :style="{width: '100%'}"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-row gutter="15">
              <el-col :span="11">
                <el-form-item label="批次号" prop="batchCode" >
                  <el-input v-model="form1.batchCode" type="text"  clearable disabled
                    :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="退料数量" prop="quantityRt">
                  <el-input v-model="form1.quantityRt" type="text" placeholder="请输入退料数量" clearable
                    :style="{width: '100%'}"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-col>
        </el-form>
      </el-row>
      <template #footer>
        <el-button @click="cancel4">取消</el-button>
        <el-button type="primary" @click="submitForm3">确定</el-button>
      </template>
    </el-dialog>

    <!-- 物料选择 -->
    <el-dialog v-model="open4" width="1200px"   @close="handleDialogClose1">
      <el-container>
        <el-aside width="200px" style="background-color: white;">
        <el-table
          style="border: none;"
          v-if="refreshTable"
          :data="type1List"
          row-key="itemTypeId"
          :default-expand-all="isExpandAll"
          :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
          @row-click="handleCategoryClick" > <!-- 新增：点击分类行触发查询 -->
          <el-table-column  align="center" prop="itemTypeName" />
        </el-table>
          </el-aside>
          <el-main>
        <el-form :model="queryParams2" ref="queryRef" :inline="true" v-show="showSearch2" label-width="68px">
          <el-form-item label="物料编码" prop="itemCode">
            <el-input
              v-model="queryParams2.itemCode"
              placeholder="请输入产品物料编码"
              clearable
              @keyup.enter="handleQuery2"
            />
          </el-form-item>
          <el-form-item label="物料名称" prop="itemName">
            <el-input
              v-model="queryParams2.itemName"
              placeholder="请输入产品物料名称"
              clearable
              @keyup.enter="handleQuery2"
            />
          </el-form-item>
          <el-form-item label="批次号" prop="batchCode">
            <el-input
              v-model="queryParams2.batchCode"
              placeholder="请输入批次号"
              clearable
              
              @keyup.enter="handleQuery2"
            />
          </el-form-item>
          <el-form-item label="仓库" prop="warehouseName">
            <el-input
              v-model="queryParams2.warehouseName"
              placeholder="请输入仓库"
              clearable
              @keyup.enter="handleQuery2"
            />
          </el-form-item>
          <el-form-item label="库区" prop="locationName">
            <el-input
              v-model="queryParams2.locationName"
              placeholder="请输入库区"
              clearable
              @keyup.enter="handleQuery2"
            />
          </el-form-item>
          <el-form-item label="库位" prop="areaName">
            <el-input
              v-model="queryParams2.areaName"
              placeholder="请输入库位"
              clearable
              @keyup.enter="handleQuery2"
            />
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="Search" @click="handleQuery2">搜索</el-button>
            <el-button icon="Refresh" @click="resetQuery2">重置</el-button>
          </el-form-item>
        </el-form>

        

      <el-table v-loading="loading2" ref="userTableRef" :data="userList1" @selection-change="handleRadioChange2">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="物料编码" align="center" prop="itemCode" />
        <el-table-column label="物料名称" align="center" prop="itemName" />
        <el-table-column label="规格型号" align="center" prop="specification" />
        <el-table-column label="在库数量" align="center" prop="quantityOnhand" />
        <el-table-column label="单位" align="center" prop="unitOfMeasure" />
        <el-table-column label="批次号" align="center" prop="batchCode" />
        <el-table-column label="仓库" align="center" prop="warehouseName" />
        <el-table-column label="库区" align="center" prop="locationName" />
        <el-table-column label="库位" align="center" prop="areaName" />
        <el-table-column label="入库时间" align="center" prop="recptDate" width="180">
          <template #default="scope">
            <span>{{ parseTime(scope.row.recptDate, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>
        
      </el-table>
      
      <pagination
        v-show="total2>0"
        :total="total2"
        v-model:page="queryParams2.pageNum"
        v-model:limit="queryParams2.pageSize"
        @pagination="getList2"
      />

    
     </el-main>
      
    </el-container>
     <el-button style="margin-left: 950px;" type="primary" @click="confirmSelectedItem2">确 认</el-button>
     <el-button @click="cancel3">关 闭</el-button>
    </el-dialog>
  </div>
</template>

<script setup name="Line">
import { listLine, getLine, delLine, addLine, updateLine } from "@/api/line/line"

const { proxy } = getCurrentInstance()

const lineList = ref([])
const open3 = ref(false)
const open4=ref(false)
const loading3 = ref(true)
const showSearch3 = ref(true)
const ids3 = ref([])
const single4 = ref(true)
const multiple4 = ref(true)
const total4 = ref(0)
const title4 = ref("")

const data3 = reactive({
  form1: {

  },
  queryParams3: {
    pageNum: 1,
    pageSize: 10,
  },
   rules3: {
    itemCode: [{
      required: true,
      message: '请输入物料编码',
      trigger: 'blur'
    }],
    
    unitOfMeasure: [],
   
    specification: [],
    batchCode: [],
    quantityRt: [{
      required: true,
      message: '请输入退料数量',
      trigger: 'blur'
    }],
  }
})


import { useRouter } from 'vue-router'//进行路由跳转
//查看物料
 function kaii1() {
    open4.value=true
}


import { listStock} from "@/api/stock/stock"

const selectedUser = ref([])
const loading2 = ref(true)
const showSearch2 = ref(true)
const ids5 = ref([])
const single2 = ref(true)
const multiple2 = ref(true)
const total2 = ref(0)

const data2 = reactive({
  form: {},
  queryParams2: {
    pageNum: 1,
    pageSize: 10,
    itemCode: null,
    itemName: null,
    itemTypeName: null,
     itemTypeId: 1,  // 新增：用于存储选中的物料分类ID
  },
})

const { queryParams2} = toRefs(data2)
const userList1 = ref([]);
/** 查询物料产品管理列表 */
function getList2() {
  loading2.value = true
  listStock(queryParams2.value).then(response => {
    userList1.value = response.rows
    total2.value = response.total
    loading2.value = false
  })
}

// 表单重置
function reset1() {
  form1.value = {
    itemId: null,
    itemCode: null,
    itemName: null,
    specification: null,
    unitOfMeasure: null,
    itemOrProduct: null,
    itemTypeId: null,
    itemTypeCode: null,
    itemTypeName: null,
    enableFlag: null,
    safeStockFlag: null,
    minStock: null,
    maxStock: null,
    remark: null,
    attr1: null,
    attr2: null,
    attr3: null,
    attr4: null,
    createBy: null,
    createTime: null,
    updateBy: null,
    updateTime: null,
     itemTypeId: 1,
  }
  proxy.resetForm("itemRef")
}

/** 搜索按钮操作 */
function handleQuery2() {
  queryParams2.value.pageNum = 1
  getList2()
}

/** 重置按钮操作 */
function resetQuery2() {
  proxy.resetForm("queryRef")
    // 清除分类ID查询条件
  queryParams2.value.itemTypeId = 1
  handleQuery2()
}


getList2()



const type1List = ref([])
const isExpandAll = ref(true)
const refreshTable = ref(true)


const data4 = reactive({
  queryParams4: {
  },
})

const { queryParams4 } = toRefs(data4)

/** 查询物料分类列表 */
function getList6() {
  loading2.value = true
  listType1(queryParams4.value).then(response => {
    type1List.value = proxy.handleTree(response.data, "itemTypeId", "parentTypeId")
    loading2.value = false
  })
}
getList6()


//下拉表
import { listType1} from "@/api/type1/type1"

/** 新增：处理物料分类点击事件 */
function handleCategoryClick(row) {
  // 设置选中的分类ID到查询参数
  queryParams2.value.itemTypeId = row.itemTypeId
  // 重置页码为1
  queryParams2.value.pageNum = 1
  // 执行查询
  getList2()
}

function handleRadioChange2(selection) {
  ids5.value = selection.map(item => item.workorderId)
  single2.value = selection.length != 1
  multiple2.value = !selection.length
    selectedUser.value = selection.length > 0 ? selection[0] : null;

}
// 选中按钮
function confirmSelectedItem2() {
  if (!selectedUser.value) {
    proxy.$modal.msgWarning("请选择一个物料");
    return;
  }
 // console.log(selectedUser.value);
  // 将选中的物料信息回填到表单
  form1.value.itemCode = selectedUser.value.itemCode;
   form1.value.batchCode = selectedUser.value.batchCode;
   form1.value.itemName = selectedUser.value.itemName;
   form1.value.specification = selectedUser.value.specification;
    form1.value.unitOfMeasure = selectedUser.value.unitOfMeasure;
  // 关闭物料选择框，返回工单表单
  open4.value = false;
  //open.value = true;

}
import { ref } from 'vue';
const userTableRef = ref(null); // 用于获取el-table实例
// 对话框关闭时的处理方法
const handleDialogClose1 = () => {
  open4.value = false;
 // open.value = true;
  if (userTableRef.value) {
    userTableRef.value.clearSelection(); // 清空表格多选框选中状态
  }
};
const handleDialogClose3=()=>{
  open.value = false;
}

function cancel3() {
  open4.value = false
  open3.value = true
  if (userTableRef.value) {
    userTableRef.value.clearSelection(); // 清空表格多选框选中状态
  }
}


const { queryParams3, form1, rules3 } = toRefs(data3)

/** 查询生产退料单行列表 */
function getList3() {
  loading3.value = true
  listLine(queryParams3.value).then(response => {
    lineList.value = response.rows
    total4.value = response.total
    loading3.value = false
  })
}

// 取消按钮
function cancel4() {
  open3.value = false
  reset3()
}

// 表单重置
function reset3() {
  form1.value = {
    lineId: null,
    rtId: null,
    materialStockId: null,
    itemId: null,
    itemCode: null,
    itemName: null,
    specification: null,
    unitOfMeasure: null,
    quantityRt: null,
    batchCode: null,
    warehouseId: null,
    warehouseCode: null,
    warehouseName: null,
    locationId: null,
    locationCode: null,
    locationName: null,
    areaId: null,
    areaCode: null,
    areaName: null,
    remark: null,
    createBy: null,
    createTime: null,
    updateBy: null,
    updateTime: null
  }
  proxy.resetForm("lineRef")
}



// 多选框选中数据
function handleSelectionChange4(selection) {
  ids3.value = selection.map(item => item.lineId)
  single4.value = selection.length != 1
  multiple4.value = !selection.length
}

/** 新增按钮操作 */
function handleAdd2() {
  reset3()
  open3.value = true
  title4.value = "添加生产退料单行"
}

/** 修改按钮操作 */
function handleUpdate3(row) {
  reset3()
  const _lineId = row.lineId || ids3.value
  getLine(_lineId).then(response => {
    form1.value = response.data
    open3.value = true
    title4.value = "修改生产退料单行"
  })
}

  const formRef = ref()
/** 提交按钮 */
function submitForm3() {
console.log("提交");

  form1.value.itemId=1
  formRef.value.validate((valid) => {
    if (valid) {
      if (form1.value.lineId != null) {
        updateLine(form1.value).then(response => {
          proxy.$modal.msgSuccess("修改成功")
          open3.value = false
          getList3()
        })
      } else {
        addLine(form1.value).then(response => {
          proxy.$modal.msgSuccess("新增成功")
          open3.value = false
          getList3()
        })
      }
    }
  })
}

/** 删除按钮操作 */
function handleDelete3(row) {
  const _lineIds = row.lineId || ids3.value
  proxy.$modal.confirm('是否确认删除生产退料单行编号为"' + _lineIds + '"的数据项？').then(function() {
    return delLine(_lineIds)
  }).then(() => {
    getList()
    proxy.$modal.msgSuccess("删除成功")
  }).catch(() => {})
}


getList3()
</script>
